<template>
  <div class="container">
    <div class="item1">
      <span v-if="show">ENG&nbsp;SHUTDOWN</span>
      <span>LANDING&nbsp;ALTTITDUE</span>
    </div>
    <div class="item2">
      <span>DOORS&nbsp;AUTO</span>
      <span>NO&nbsp;SMOKING&nbsp;ON</span>
    </div>
  </div>
</template>

<script setup>
import { defineProps } from 'vue'

// 定义props，传入show，默认值为true
const props = defineProps({
  show: {
    type: Boolean,
    default: true
  }
})
</script>

<style scoped>
.container {
  margin-left: 50px;
  width: 300px;
  height: 190px;
}
.item1 {
  height: 100px;
  display: flex;
  flex-direction: column; /* 设置为垂直排列 */
  align-items: center;
  color: yellow;
}
.item2 {
  display: flex;
  flex-direction: column; /* 设置为垂直排列 */
  align-items: center;
}
</style>
